{extend name="public/pure"}
{block name="style"}
<title>点对点教育VIP学员_信息认证</title>
<link rel="stylesheet" href="__HOME__/css/user/memberslogin.css">
<link rel="stylesheet" href="__ADMIN__/css/chosen/chosen.css">
<style>
    @keyframes rotate {
        0% {
            transform:rotate(0deg);
        }
        50% {
            transform:rotate(180deg);
        }
        100% {
            transform:rotate(360deg);
        }
    }
    .showbox {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 5%;
        background: rgba(0, 0, 0, 0.3);
        display: none;
    }

    .loader {
        position: relative;
        margin: 0 auto;
        width: 100px;
        margin-top: 70%;
    }
    .loader:before {
        content: '';
        display: block;
        padding-top: 50%;
    }

    .circular {
        animation: rotate 2s linear infinite;
        height: 100%;
        transform-origin: center center;
        width: 100%;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }

    .path {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
        stroke-linecap: round;
    }

    @keyframes rotate {
        100% {
            transform: rotate(360deg);
        }
    }
    @keyframes dash {
        0% {
            stroke-dasharray: 1, 200;
            stroke-dashoffset: 0;
        }
        50% {
            stroke-dasharray: 89, 200;
            stroke-dashoffset: -35px;
        }
        100% {
            stroke-dasharray: 89, 200;
            stroke-dashoffset: -124px;
        }
    }
    @keyframes color {
        100%,
        0% {
            stroke: #d62d20;
        }
        40% {
            stroke: #0057e7;
        }
        66% {
            stroke: #008744;
        }
        80%,
        90% {
            stroke: #ffa700;
        }
    }
    .single{
        padding-left: 4.66vw;
        margin-top: 5vw;
        font-size: 1.5rem;
    }
    .hy-radio {
         width: 20px;
         height: 0px;
         background-color: #000;
         /*margin-right: 30px;*/
         border-radius: 50%;
         position: relative;
         top: -15px;
     }
    .hy-radio:before,.hy-radio:after {
        content: '';
        display: block;
        position: absolute;
        border-radius: 50%;
        transition: .3s ease;
    }
    .hy-radio:before {
        top: 0px;
        left: -1px;
        width: 18px;
        height: 18px;
        background-color: #fff;
        border: 1px solid #f2531f;
    }
    .hy-radio:after {
        top: 6px;
        left: 4.5px;
        width: 8px;
        height: 8px;
        background-color: #fff;
    }
    .hy-radio:checked:after {
        top: 4px;
        left: 3px;
        width: 12px;
        height: 12px;
        background-color: #f2531f;
    }
    .hy-radio:checked:before {
        border-color:#f2531f;
    }
    .teacher{
        float: right;
        margin-right: 25px;
        font-size: 15px;
        color: darkgreen;
        height: 3vw;
        line-height: 3vw;
    }
</style>
{/block}
{block name="body"}
<div class="banner">
    <img src="__ADMIN__/images/logo.png">
    {eq name="$msg.role" value="0"}
    <p>学员服务信息认证</p>
    {else/}
    <p>老师信息认证</p>
    {/eq}
</div>
<div class="box">
{eq name="$msg.review_status" value="0"}
<div class="login-box">
    <div class="form">
        <div class="uid">
            <span></span><input type="number" maxlength="11" placeholder="请输入手机号" id="phone">
        </div>
        <div class="single">
            <input type="radio" class="hy-radio"  value="1"  name="type" > 专升本&emsp;
            <input type="radio" class="hy-radio"  value="2" name="type" checked> 留学&emsp;
            <input type="radio" class="hy-radio"  value="3" name="type" checked> 考研+其他

        </div>
    </div>
</div>
{else/}
    {eq name="$msg.role" value="0"}
<div class="login-boxs">
    <div>* 姓&nbsp;&nbsp;&nbsp;名：&nbsp;{$msg.name}（学生）</div>
    <div>* 手机号：&nbsp;{$msg.tel}</div>
    {notempty name="$msg.vip_id"}
    <div>* 点对点学号：&nbsp;{$msg.vip_id}</div>
    {/notempty}
    {notempty name="$msg.order_id"}
    <div>* VIP编号：&nbsp;{$msg.order_id}</div>
    {/notempty}
    <div>* 学校：&nbsp;{$msg.xuexiao|mb_substr=###,0,45}...</div>
</div>
    {else/}
    <div class="login-boxss">
    <div>* 姓&nbsp;&nbsp;&nbsp;名：&nbsp;{$msg.name}（老师）</div>
    <div>* 手机号：&nbsp;{$msg.tel}</div>
    <div>* 职位：&nbsp;{$msg.position}</div>
    <div>* 大学：&nbsp;{$msg.xuexiao|mb_substr=###,0,45}...</div>
    </div>
    {/eq}
{/eq}
{eq name="$msg.review_status" value="0"}
<div class="btn" id="btn">确&emsp;认</div>
    <a href="{:Url('User/teacher')}" class="teacher">我是老师 >></a>
{else/}
<div class="btns">已&emsp;认&emsp;证</div>
{/eq}
    <div class="login">
        {eq name="$msg.role" value="0"}
        <div style="padding: 10px"> * 注 ：需手机号认证，通过后不可修改，请谨慎填写。</div>
        {else/}
        <div style="padding: 10px"> * 注 ：需手机号认证，通过后不可修改，请谨慎填写。</div>
        {/eq}
        </div>
</div>
<footer>
    <img src="__HOME__/images/user/footer.png">
</footer>

<div class="showbox">
    <div class="loader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>
        </svg>
    </div>
</div>

{/block}
{block name="script"}
<script src="__ADMIN__/js/chosen.jquery.js"></script>
<script src="__ADMIN__/js/plugins/sweetalert/sweetalert.min.js"></script>
<script>
    //关闭分享
    function onBridgeReady() {
        WeixinJSBridge.call('hideOptionMenu');
    }
    if (typeof WeixinJSBridge == "undefined") {
        if (document.addEventListener) {
            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
        } else if (document.attachEvent) {
            document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
        }
    } else {
        onBridgeReady();
    }
    var win_height = $(window).height();
    $(function(){
        $(".showbox").hide();
        $('#btn').on("click",function(){
            login()
        });
        //绝对定位bug
        var vh =$(window).height() - $(window).width()*0.265 - $('.banner').height() - $('.box').height();
        if(vh < 0){
            vh = 0;
        }
        $('footer').css({
//            'position': 'relative',
            'margin-top': vh
        });
    });

    $(window).resize(function(){
        var height = $(window).height();
        if(height<win_height){
            $("footer").hide();
        }else{
            $("footer").show();
        }
    })

    /**登陆**/
    function login(){
        var re=reg();
        var uid=$('.uid>input').val();
        var type = $("input[type=radio]:checked").val();
        if(re==true){
            $.ajax({
                url: "{:Url('User/register')}",
                type: 'post',
                data: {
                    tel: uid,
                    type:type
                },
                beforeSend: function(XMLHttpRequest){
                    $(".showbox").show();
                },
                success:function(data){
                    $(".showbox").hide();
                    if(data.code == 1){
                        swal({
                            title: ' ',
                            text: data.msg,
                            type: 'success',
                            confirmButtonText:'确定'
                        });
                        setTimeout(function(){
                            window.location.reload();
                        },500);
                    }else{
                        swal({
                            title: ' ',
                            text: data.msg,
                            type: 'error',
                            confirmButtonText:'确定'
                        });
                    }
                }
            })
        }else{
            swal({
                title: '',
                text: re,
                type: 'error',
                confirmButtonText:'确定'
            });
        }
    }
    /**表单验证**/
    function reg(){
        var uid=$('.uid>input').val();
        if(uid==''||uid==null){
            return "请输入手机号码！";
        }else{
            var myreg = /^1[3456789]{1}\d{9}$/;
            var res = myreg.test(uid);
            if(uid.length<11 || !res)
            {
                return '请输入有效的手机号码！';
            }else{
                return true
            }
        }
    }

</script>
{/block}